//Title: Hovercard plugin by PC
//Documentation: http://designwithpc.com/Plugins/Hovercard
(function ($) {
$.fn.hovercard = function (options) {
var defaults = {
width: 300,
openOnLeft: false,
openOnTop: false,
cardImgSrc: "",
detailsHTML: "",
twitterScreenName: '',
showTwitterCard: false,
facebookUserName: '',
showFacebookCard: false,
showCustomCard: false,
customCardJSON: {},
customDataUrl: '',
background: "#ffffff",
delay: 0,
autoAdjust: true,
onHoverIn: function () { },
onHoverOut: function () { }
};
var options = $.extend(defaults, options);
if ($('#css-hovercard').length <= 0) {
var hovercardTempCSS = '")';
$(hovercardTempCSS).appendTo('head');
}
//Executing functionality on all selected elements
return this.each(function () {
var obj = $(this);
var hassanHTML, hassanIMG='';
//wrap a parent span to the selected element
obj.wrap('');
//add a relatively positioned class to the selected element
obj.addClass("hc-name");
//Added by Hassan
hassanHTML =options.detailsHTML;
if (options.detailsHTML=='')
hassanHTML=$(this).closest('.hc-name').attr('data-hover-content');
hassanIMG =options.cardImgSrc;
if (options.cardImgSrc=='')
hassanIMG=$(this).closest('.hc-name').attr('data-hover-image');
var hcImg='';
if (typeof hassanIMG !='undefined' && hassanIMG.length > 0) {
hcImg = '';
}
//Hassan deleted: hcImg+ options.cardImgSrc
//generate details span with html provided by the user
var hcDetails = '
' + hcImg + hassanHTML + '
';
//append this detail after the selected element
obj.after(hcDetails);
obj.siblings(".hc-details").eq(0).css({ 'width': options.width, 'background': options.background });
//toggle hover card details on hover
obj.closest(".hc-preview").hover(function () {
var $this = $(this);
adjustToViewPort($this);
//Up the z indiex for the .hc-name to overlay on .hc-details
$this.css("zIndex", "200");
obj.css("zIndex", "100").find('.hc-details').css("zIndex", "50");
if (options.noOverride)
obj.css("zIndex", "0").find('.hc-details').css("zIndex", "100");
var curHCDetails = $this.find(".hc-details").eq(0);
curHCDetails.stop(true, true).delay(options.delay).fadeIn();
if (typeof options.onHoverIn == 'function') {
if (options.showCustomCard && curHCDetails.find('.s-card').length <= 0) {
var dataUrl = options.customDataUrl;
if (typeof obj.attr('data-hovercard') == 'undefined') {
//do nothing. detecting typeof obj.attr('data-hovercard') != 'undefined' didn't work as expected.
} else if (obj.attr('data-hovercard').length > 0) {
dataUrl = obj.attr('data-hovercard');
}
LoadSocialProfile("custom", dataUrl, curHCDetails, options.customCardJSON);
}
if (options.showTwitterCard && curHCDetails.find('.s-card').length <= 0) {
var tUsername = options.twitterScreenName.length > 0 ? options.twitterScreenName : obj.text();
if (typeof obj.attr('data-hovercard') == 'undefined') {
} else if (obj.attr('data-hovercard').length > 0) {
tUsername = obj.attr('data-hovercard');
}
LoadSocialProfile("twitter", tUsername, curHCDetails);
}
if (options.showFacebookCard && curHCDetails.find('.s-card').length <= 0) {
var fbUsername = options.facebookUserName.length > 0 ? options.facebookUserName : obj.text();
if (typeof obj.attr('data-hovercard') == 'undefined') {
} else if (obj.attr('data-hovercard').length > 0) {
fbUsername = obj.attr('data-hovercard');
}
LoadSocialProfile("facebook", fbUsername, curHCDetails);
}
//Callback function
options.onHoverIn.call(this);
}
}, function () {
//Undo the z indices
$this = $(this);
$this.find(".hc-details").eq(0).stop(true, true).fadeOut(300, function () {
$this.css("zIndex", "0");
obj.css("zIndex", "0").find('.hc-details').css("zIndex", "0");
if (typeof options.onHoverOut == 'function') {
options.onHoverOut.call(this);
}
});
});
function adjustToViewPort(hcPreview) {
var hcDetails = hcPreview.find('.hc-details').eq(0);
var hcPreviewRect = hcPreview[0].getBoundingClientRect();
var hcdTop = hcPreviewRect.top - 20; //Subtracting 20px of padding;
var hcdRight = hcPreviewRect.left + 35 + hcDetails.width(); //Adding 35px of padding;
var hcdBottom = hcPreviewRect.top + 35 + hcDetails.height(); //Adding 35px of padding;
var hcdLeft = hcPreviewRect.top - 10; //Subtracting 10px of padding;
if (options.openOnLeft || (options.autoAdjust && (hcdRight > window.innerWidth))) {
hcDetails.addClass("hc-details-open-left");
} else {
hcDetails.removeClass("hc-details-open-left");
}
if (options.openOnTop || (options.autoAdjust && (hcdBottom > window.innerHeight))) {
hcDetails.addClass("hc-details-open-top");
} else {
hcDetails.removeClass("hc-details-open-top");
}
}
function LoadSocialProfile(type, username, curHCDetails, customCardJSON) {
var cardHTML, urlToRequest, customCallback, loadingHTML, errorHTML;
switch (type) {
case "twitter":
{
urlToRequest = 'http://api.twitter.com/1/users/lookup.json?screen_name=' + username;
cardHTML = function (profileData) {
profileData = profileData[0];
return '